<style lang="stylus" scoped>
bgBlue = linear-gradient(to right, #04befe, #4481eb)
nav
    width 100%
    height 50px
    background bgBlue
    img
        display inline-block
        float left
        width 25px
        height 25px
        margin 12px 10px
    p
        display inline-block
        width 80%
        float left
        font-size 18px
        color #ffffff
        text-align center
        line-height 50px
.list
    margin 20px 0
    li
        float left
        width 25%
        text-align center
        list-style none
        margin 10px 0
        line-height 2
        a
            display inline-block
            color #333
        img
            display inline-block
            width 4.6rem
            height 4.6rem
            border-radius 50%
            border 1px solid #ccc
button
    width 92%
    margin 2rem 4% 5rem 4%
#msgBox
    display none
    position absolute
    top 0
    left 0
    width 100%
    height 100%
    background rgba(50, 50, 50, 0.5)
    line-height 1.8
.msg
    width 80%
    min-height 100px
    font-size 0.95rem
    margin 40% auto
    background #fff
    border-radius 8px
    color #666
    border 1px solid #ddd
    box-shadow 0 0 15px #999
p
    padding 1rem
.btno
    display inline-block
    width 50%
    line-height 3
    color #666
    text-align center
.btnr
    color #3377bd
    border-left 1px solid #ddd
.img
    display inline-block
    background #3377bd
    width 4.8rem
    height 4.8rem
    border-radius 50%
    border 1px solid #408ecd
    background-size 2rem 2.3rem
    margin-top -2.4rem
    box-shadow 0 0 15px #999
</style>
<template>
    <div>
        <nav>
            <router-link to="/speedcard">
                <img src="./imgs/icon-left.png" alt="">
                <p>进度查询</p>
            </router-link>
        </nav>
        <ul class="list">
            <li v-for="bank in bankList" :key="bank.bankId">
                <a :href="'http://'+bank.urlPlanQuery">
                    <img :src="bank.img" alt="">
                    <p>{{bank.bankName}}</p>
                </a>
            </li>

        </ul>
        <router-link to="speedcard">
            <Button class="btn" type="primary" shape="circle">返回</Button>
        </router-link>
    </div>
</template>
<script>
import axios from "axios";
export default {
  data() {
    return {
      bankList: []
    };
  },
  created() {
    var _this = this;
    axios
      .post("web/api/bank/list")
      .then(function(res) {
        // console.log("银行列表：", res);
        var data = res.data.date;
        console.log("银行列表：", data);

        if (res.data.code === 1) {
          _this.bankList = data;
        }
      })
      .catch(err => {
        console.log("err:", err);
      });
  },
  methods: {
      See (e) {
        window.location.href = e
        }
  }
};
</script>
